<template>
  <el-select v-model="{$v_model}" allow-create filterable remote placeholder="{$placeholder}" clearable :remote-method="{$remote_method}" :loading="loading">
     <el-option
       v-for="item in {$optionList}"
         :key="item.{$key}"
         :label="item.{$label}"
         :value="item.{$value}">
      </el-option>
   </el-select>
</template>
<script>
  export default {
    data() {
      return {
        {$optionList}:[],
      }
    },
    mounted() {
    },
      computed: {},
      watch: {},
    methods: {
      init() {
        this.$http.get("{$tables}").then(response => {
          this.{$optionList} = response.data;
        });
      },
      {$remote_method}(query) {
        if (query !== '') {
          this.loading = true;
          this.$http.get("{$tables}"+"?{$field}="+query).then(response => {
            this.loading = false;
            this.{$optionList} = response.data;
          });
        } else {
          this.options = [];
        }
      },
    },
  }
</script>